import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:get/get.dart';
import 'package:xindong/common/xindong_sezhi.dart';
import 'package:xindong/manager/xindong_payment_singleton.dart';
import 'package:xindong/models/xindong_recharge_class.dart';
import 'package:xindong/res/assets_res.dart';
import 'package:xindong/routes/user/wallet/xindong_recharge_ctr.dart';
import 'package:xindong/utils/xindong_image_util.dart';
import 'package:xindong/widgets/container/xindong_empty_container.dart';

class XinDongRechargeListView extends StatelessWidget {
  const XinDongRechargeListView({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisSize: MainAxisSize.min,
      children: [
        GetBuilder<XinDongRechargeCtr>(initState: (state) {
          XinDongRechargeCtr.to.requestGetList();
        }, builder: (controller) {
          return XinDongEmptyContainer(
            dataList: controller.dataList,
            child: AlignedGridView.count(
              itemCount: controller.dataList.length,
              padding: const EdgeInsets.only(bottom: 10),
              crossAxisCount: 3,
              mainAxisSpacing: 10,
              crossAxisSpacing: 10,
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              itemBuilder: (BuildContext context, int index) {
                final model = controller.dataList[index];
                return _buildGridItem(model, () => controller.setSelectClass(model));
              },
            ),
          );
        }),
        _buildMethod()
        // !Platform.isIOS ? createWay() : SizedBox(),
      ],
    );
  }

  Widget _buildGridItem(XinDongRechargeClass model, Function() onTap) {
    return GestureDetector(
      onTap: onTap,
      child: Stack(
        clipBehavior: Clip.none,
        children: [
          GetBuilder<XinDongRechargeCtr>(
            id: 'model',
            builder: (walletController) {
              bool isSelectClass = walletController.isSelectClass(model);
              return Container(
                height: 90,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(isSelectClass ? 9 : 8),
                  color: DZColors.cellColor,
                  border: Border.all(color: isSelectClass ? DZColors.mainColor : DZColors.placeholderColor, width: 1),
                ),
                child: Stack(
                  children: [
                    Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            // ImageHelper.asset(AssetsRes.MINE_CORN, width: 20, height: 20),
                            Text(
                              '${model.money}',
                              style: const TextStyle(
                                  color: DZColors.titleColor, fontSize: 18, fontWeight: FontWeight.w500),
                            ),
                            const SizedBox(width: 2),
                            ImageUtil.asset(AssetsRes.ICON_GOLD_COIN, width: 20, height: 20),
                          ],
                        ),
                        const SizedBox(height: 5),
                        Text(
                          '送${model.reward_money}金币',
                          style: const TextStyle(color: DZColors.mainColor, fontSize: 12),
                        ),
                        const SizedBox(height: 5),
                        Text(
                          "￥${model.price}",
                          style: const TextStyle(color: DZColors.titleColor, fontSize: 14, height: 1.2),
                        ),
                      ],
                    ),
                    if (isSelectClass)
                      Positioned(
                        right: 0,
                        bottom: 0,
                        child: ImageUtil.asset(AssetsRes.RECHARGE_SELECT, width: 20, height: 20),
                      ),
                  ],
                ),
              );
            },
          ),
          model.is_first == 1
              ? Positioned(
                  left: 0,
                  top: -10,
                  child: ImageUtil.asset(AssetsRes.RECHARGE_LABEL_DISCOUNT, width: 64, height: 20),
                )
              : const SizedBox(),
        ],
      ),
    );
  }

  Widget _buildMethod() {
    return Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const SizedBox(height: 24),
        const Text(
          "支付方式",
          style: TextStyle(color: DZColors.titleColor, fontSize: 16),
        ),
        const SizedBox(height: 10),
        GetBuilder<XinDongRechargeCtr>(
          id: 'method',
          builder: (walletController) {
            bool isSelectLeft = walletController.isSelectWay(PaymentMethod.wx);
            bool isSelectRight = walletController.isSelectWay(PaymentMethod.ant);
            Color leftBorderColor = isSelectLeft ? DZColors.mainColor : DZColors.placeholderColor;
            Color rightBorderColor = isSelectRight ? DZColors.mainColor : DZColors.placeholderColor;
            return Row(
              children: [
                Expanded(
                  flex: 1,
                  child: GestureDetector(
                    onTap: () => walletController.setSelectWay(PaymentMethod.wx),
                    child: Stack(
                      children: [
                        Container(
                          height: 44,
                          alignment: Alignment.center,
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(10),
                            border: Border.all(color: leftBorderColor, width: 1),
                            color: DZColors.cellColor,
                          ),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              ImageUtil.asset(AssetsRes.RECHARGE_ICON_WECHAT, width: 22, height: 22),
                              const SizedBox(width: 10),
                              const Text(
                                "微信",
                                style: TextStyle(color: DZColors.titleColor, fontSize: 17),
                              ),
                            ],
                          ),
                        ),
                        if (isSelectLeft)
                          Positioned(
                            right: 0,
                            bottom: 0,
                            child: ImageUtil.asset(AssetsRes.RECHARGE_SELECT, width: 20, height: 20),
                          ),
                      ],
                    ),
                  ),
                ),
                const SizedBox(width: 10),
                Expanded(
                  flex: 1,
                  child: GestureDetector(
                    onTap: () => walletController.setSelectWay(PaymentMethod.ant),
                    child: Stack(
                      children: [
                        Container(
                          height: 44,
                          alignment: Alignment.center,
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(8),
                            border: Border.all(color: rightBorderColor, width: 1),
                            color: DZColors.cellColor,
                          ),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              ImageUtil.asset(AssetsRes.RECHARGE_ICON_ZHI, width: 22, height: 22),
                              const SizedBox(width: 10),
                              const Text(
                                "支付宝",
                                style: TextStyle(color: DZColors.titleColor, fontSize: 17),
                              ),
                            ],
                          ),
                        ),
                        if (isSelectRight)
                          Positioned(
                            right: 0,
                            bottom: 0,
                            child: ImageUtil.asset(AssetsRes.RECHARGE_SELECT, width: 20, height: 20),
                          ),
                      ],
                    ),
                  ),
                )
              ],
            );
          },
        )
      ],
    );
  }
}
